/*
* @Author: karry
* @Date:   2019-08-04 03:04:54
* @Last Modified by:   karry
* @Last Modified time: 2019-08-04 03:04:54
*/
import React 	  from 'react';

// 通用的列表
class Pagination extends React.Component{
	constructor(props){
		super(props);
		this.state = {
			isFirstLoading : true
		}
	}
	componentWillReceiveProps(){
		// 列表只有在第一次挂载的时候，isFirstLoading为true，其他情况为false
		this.setState({
			isFirstLoading : false
		});
	}
	render(){
		// 表头信息
		let tableHeader = this.props.tableHeads.map(
			(tableHead, index) => {
					if (typeof tableHead === 'object') {
						return <th key={index} width={tableHead.width}>{tableHead.name}</th>
					}else if (typeof tableHead === 'string') {
						return <th key={index}>{tableHead}</th>
					}
				}
			);
		// 列表内容
		let listBody = this.props.children;
		// 列表信息
		let listInfo = (
			<tr>
				<td colSpan={this.props.tableHeads.length} className="text-center">{this.state.isFirstLoading ? '正在加载数据...' : '没有找到相应的结果'}</td>
			</tr>
		);
		let tableBody = listBody.length > 0 ? listBody : listInfo;
		return (
			<div>
				<div className="col-md-12">
					<table className="table table-striped table-bordered">
						<thead>
							<tr>
							{tableHeader}
							</tr>
						</thead>
						<tbody>
							{tableBody}
						</tbody>
					</table>
				</div>
			</div>
		);
	}
}

export default Pagination;